<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>项目保密协议</title>
    <style>
        body {
            background-color: #f4f4f5;
            font-family: "SimSun", sans-serif;
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
            margin: 0;
        }

       .a4-container {
            width: 210mm;
            min-height: 297mm;
            padding: 32px;
            background-color: #fff;
            box-shadow: 0 4px 6 -1px rgba(0, 0, 0, 0.1), 0 2px 4 -1px rgba(0, 0, 0, 0.06);
            border-radius: 8px;
            position: relative;
            box-sizing: border-box;
        }

       .title {
            font-size: 22px;
            font-weight: bold;
            text-align: center;
            color: #000;
            margin-bottom: 24px;
        }

       .content-text {
            color: #000;
            line-height: 1.2;
            margin-bottom: 16px;
            text-indent: 2em;
        }

       .rule-list {
            list-style-type: decimal;
            padding-left: 24px;
            color: #000;
            line-height: 1.75;
            margin-bottom: 32px;
        }

       .editable {
            border-bottom: 1px solid #000;
            outline: none;
            display: inline-block;
            text-indent: 0px;
        }

       .print-button {
            position: fixed;
            top: 50%;
            right: 20px;
            transform: translateY(-50%);
            padding: 10px 20px;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
        }

       .print-button:hover {
            background: linear-gradient(135deg, #764ba2 0%, #667eea 100%);
        }

       .info-row {
            display: flex;
            justify-content: space-between;
            margin-bottom: 16px;
        }

        @media print {
            body {
                background-color: transparent;
            }

           .a4-container {
                box-shadow: none;
                border-radius: 0;
                width: 210mm;
                min-height: 297mm;
                margin: 0;
                padding: 32px;
                page-break-after: avoid;
            }

           .print-button {
                display: none;
            }
        }
    </style>
</head>

<body>
    <div class="a4-container">
        <h1 class="title">项目保密协议</h1>
        <div class="info-row">
            <p class="content-text">甲方：<span class="editable" contenteditable="true" data-default="[甲方名称]">[甲方名称]</span></p>
            <p class="content-text">乙方：<span class="editable" contenteditable="true" data-default="[乙方名称]">[乙方名称]</span></p>
        </div>
        <p class="content-text">鉴于甲乙双方签订了 <span class="editable" contenteditable="true" data-default="[具体项目名称]">[具体项目名称]</span> 项目（以下简称“项目”），在“项目”实施期间（以下简称“合作期间”），甲方需要向乙方提供，或者乙方在合作过程中会接触到甲方项目相关的业务信息、技术资料、客户名单、商业计划等保密信息。为保障保密信息安全，维护双方合法权益，依据相关法律法规，经友好协商，双方就前述事宜中所涉及的保密信息安全达成以下一致：</p>
        <ol class="rule-list">
            <li><strong>定义</strong>
                <p class="content-text">本协议所称“保密信息”系指甲方在合作期间以任何方式（包括但不限于书面、口头、可视方式）向乙方提供的，或在合作过程中乙方所接触到的、以任何形式体现的甲方与项目相关的任何业务信息、技术资料、客户名单、商业计划、财务数据、技术秘密、商业秘密等，和/或其中的任何知识产权。</p>
            </li>
            <li><strong>保密责任</strong>
                <ol type="a">
                    <li>甲方提供保密信息的行为不构成向乙方授予任何与保密信息相关的专利权、专利申请权、商标权、著作权、商业秘密或其它的知识产权、所有权或其他任何权利。</li>
                    <li>乙方对保密信息的使用应当满足下列要求：
                        <ul>
                            <li>乙方应遵守甲方上级单位及甲方公司内部关于保密方面的管理规定，包括但不限于本协议签订前和履行期间甲方制定的相关管理办法，如《保密管理制度》等。</li>
                            <li>乙方承诺仅在本次“合作”期间，为“项目”的目的使用保密信息，不为任何其他目的使用保密信息。</li>
                            <li>未经甲方的事先书面批准，乙方不得以任何形式或任何方式将保密信息和/或其中的任何部分，披露或透露给任何第三方。</li>
                            <li>乙方有义务妥善保管必要的保密信息，不得私自复制、泄漏或遗失，对于乙方保管的保密信息应采取必要技术保护措施，例如：数据加密、访问控制、日志审计等。</li>
                            <li>乙方不得依据保密信息，就任何问题，向任何第三方做出任何建议。</li>
                            <li>未经甲方同意，乙方不得利用上述保密信息进行新的研究和开发。</li>
                        </ul>
                    </li>
                    <li>甲方同意乙方有权向其职员透露或使其接触保密信息和/或其中的任何相关部分，这些职员应是参与项目运行的项目组人员。前提是乙方向职员透露或使其接触保密信息前，已经从该职员获得了至少与本协议保密义务一样严格的保密承诺，并要求在项目结束或职员退出该项目后删除保密信息，不得私人进行备份。</li>
                    <li>甲方有权在甲方认为必要的情况下收回所提供的保密信息及其使用权，乙方应配合甲方行使上述权利，按照甲方的要求将所控制的保密信息交回甲方、删除或销毁。</li>
                </ol>
            </li>
            <li><strong>违约责任</strong>
                <ol type="a">
                    <li>乙方的职员违背保密承诺，未按照本协议的规定使用保密信息，或未遵守甲方保密管理规定造成保密信息泄露，或向第三方披露保密信息，或依据该等保密信息向第三方做出任何建议，或利用保密信息进行新的研究开发，都被视为乙方违反本协议。</li>
                    <li>如任何乙方违反本协议，甲方有权要求乙方承担下述各项违约责任，同时甲方有权以书面形式单方面通知乙方终止合作：
                        <ul>
                            <li>立即停止违反本协议的行为；</li>
                            <li>采取一切有效措施防止保密信息泄露范围继续扩大；</li>
                            <li>乙方应按照国家法律法规的相关规定承担违约责任以及因此给甲方造成的一切损失，包括但不限于甲方因此受到的直接、间接、连带、特殊损失，甲方为调查乙方违约所支出的费用，甲方因乙方违反本协议而导致的任何支出、罚金和费用等；</li>
                            <li>甲方有权利采取将乙方加入甲方合作负面行为名单，报送相关行业管理部门将乙方加入行业负面行为名单等措施。</li>
                        </ul>
                    </li>
                    <li>凡因执行本协议所发生的或与本协议有关的一切争议，双方应通过友好协商解决。</li>
                </ol>
            </li>
            <li><strong>本协议有效期和保密信息使用期限</strong>
                <ol type="a">
                    <li>本协议有效期至 <span class="editable" contenteditable="true" data-default="[有效期截止日期]">[有效期截止日期]</span>。</li>
                    <li>除法律明确规定外，本协议规定的保密信息的使用期限仅限于“合作”过程中（协议有效期内）使用，合作结束后除非甲方书面授权，乙方应将所控制的保密信息交回甲方、删除或销毁。</li>
                    <li>保密信息的保密责任期限为自本协议生效之日起至保密信息失去其保密性质并为公众所知悉之时为止，不因“合作”终止或解除（协议到期）而结束。</li>
                </ol>
            </li>
            <li><strong>免责条款</strong>
                <p class="content-text">由于地震、水灾、火灾或政策法规变化等不能预见、不能避免、不能抗拒的原因，导致甲乙双方或一方不能履行或不能完全履行本协议项下的有关义务时，甲乙双方相互不承担违约责任；在不可抗力影响消除后的合理时间内，一方或双方应当继续履行本协议。</p>
            </li>
            <li><strong>其他条款</strong>
                <ol type="a">
                    <li>本协议未尽事宜，双方可签订补充协议。本协议的补充协议为其不可分割的一部分，与本协议具有同等法律效力。</li>
                    <li>本协议壹式2份，双方各执1份，具有同等法律效力。</li>
                    <li>本协议自乙方签字盖章之日起生效。</li>
                </ol>
            </li>
        </ol>
        <div class="info-row">
            <p class="content-text">甲方：<span class="editable" contenteditable="true" data-default="[甲方名称]">[甲方名称]</span></p>
            <p class="content-text">乙方：<span class="editable" contenteditable="true" data-default="[乙方名称]">[乙方名称]</span></p>
        </div>
        <div class="info-row">
            <p class="content-text">授权代表：<span id="signature-line" class="editable">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></p>
            <p class="content-text">授权代表：<span id="signature-line" class="editable">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></p>
        </div>
        <div class="info-row">
            <p class="content-text">日期：<span class="editable" contenteditable="true" data-default="[签字日期]">[签字日期]</span></p>
            <p class="content-text">日期：<span class="editable" contenteditable="true" data-default="[签字日期]">[签字日期]</span></p>
        </div>
    </div>
    <button class="print-button" onclick="window.print()">打印</button>
    <script>
        const currentDate = new Date();
        const year = currentDate.getFullYear();
        const month = String(currentDate.getMonth() + 1).padStart(2, '0');
        const day = String(currentDate.getDate()).padStart(2, '0');
        const currentDateStr = `${year}年${month}月${day}日`;
        const editableDateElements = document.querySelectorAll('.editable[data-default="[签字日期]"]');
        editableDateElements.forEach(element => {
            element.textContent = currentDateStr;
        });

        const editableElements = document.querySelectorAll('.editable');
        editableElements.forEach(element => {
            element.addEventListener('focus', function () {
                setTimeout(() => {
                    if (this.textContent === this.dataset.default) {
                        this.textContent = '';
                        this.style.color = '#000';
                    }
                }, 0);
            });
            element.addEventListener('blur', function () {
                if (this.textContent === '') {
                    this.textContent = this.dataset.default;
                    this.style.color = '#777';
                }
            });
            element.addEventListener('input', function () {
                const defaultVal = this.dataset.default;
                const allSameElements = document.querySelectorAll(`.editable[data-default="${defaultVal}"]`);
                allSameElements.forEach(sameElement => {
                    sameElement.textContent = this.textContent;
                });
            });
        });
    </script>
</body>

</html>